<template>
  <div class="app-container">
    <h5 v-if="isType==1" class="titleInfo">对公账户</h5>
    <h5 v-if="isType==2" class="titleInfo">对私账户</h5>
    <div v-loading="tableLoading" class="listDiv">
      <el-form ref="form" class="form" :model="form" label-width="150px">
        <el-row>
          <!-- <h5 v-if="isType==1" class="titleInfo">对公账户</h5> -->
          <div v-if="isType==1">
            <el-col :span="24">
              <el-form-item label="银行卡类型">
                <span class="spanToInput">对公账户</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="银行卡号">
                <span class="spanToInput">{{ detalisList.cardNo }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="开户行名称">
                <span class="spanToInput">{{ detalisList.bankTitle }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="开行支行">
                <span class="spanToInput">{{ detalisList.branchTitle }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="企业账户名称">
                <span class="spanToInput">{{ detalisList.accountTitle }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="法人名称">
                <span class="spanToInput">{{ detalisList.enpUser }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="社会信用代码">
                <span class="spanToInput">{{ detalisList.identity }}</span>
              </el-form-item>
            </el-col>
            <el-form-item>
              <div class="mar_top" />
            </el-form-item>
            <el-col :span="24">
              <el-form-item label="提现状态">
                <span class="spanToInput">{{ detalisList.auditStatus | checkType }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="提现金额">
                <span
                  class="spanToInput"
                >{{ Number(detalisList.amount).toFixed(2) }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="提交审核日期">
                <span class="spanToInput">{{ detalisList.createdAt }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="审核通过日期">
                <span class="spanToInput">{{ detalisList.updatedAt }}</span>
              </el-form-item>
            </el-col>
            <div v-if="isStatus == 2">
              <el-col :span="12">
                <el-form-item label="驳回理由" prop="remark">
                  <el-input
                    v-model="form.remark"
                    type="textarea"
                    :rows="4"
                    disabled
                  />
                </el-form-item>
              </el-col>
            </div>
          </div>
          <!--  v-else -->
          <div v-else>
            <!-- <h5 v-if="isType==2" class="titleInfo">对私账户</h5> -->
            <el-col :span="24">
              <el-form-item label="银行卡类型">
                <span class="spanToInput">对私账户</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="银行卡号">
                <span class="spanToInput">{{ detalisList.cardNo }}</span>
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item label="开户行名称">
                <span class="spanToInput">{{ detalisList.bankTitle }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="持卡人">
                <span class="spanToInput">{{ detalisList.accountTitle }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="身份证号">
                <span class="spanToInput">{{ detalisList.identity }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="手机号">
                <span class="spanToInput">{{ detalisList.phone }}</span>
              </el-form-item>
            </el-col>
            <el-form-item>
              <div class="mar_top" />
            </el-form-item>
            <el-col :span="24">
              <el-form-item label="提现状态">
                <span class="spanToInput">{{ detalisList.auditStatus | checkType }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="提现金额">
                <span
                  class="spanToInput"
                >{{ Number(detalisList.amount).toFixed(2) }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="提交审核日期">
                <span class="spanToInput">{{ detalisList.createdAt }}</span>
              </el-form-item>
            </el-col>
            <el-col :span="24">
              <el-form-item label="审核通过日期">
                <span class="spanToInput">{{ detalisList.updatedAt }}</span>
              </el-form-item>
            </el-col>
            <div v-if="isStatus == 2">
              <el-col :span="12">
                <el-form-item label="驳回理由" prop="remark">
                  <el-input
                    v-model="form.remark"
                    type="textarea"
                    :rows="4"
                    disabled
                  />
                </el-form-item>
              </el-col>
            </div>
          </div>
        </el-row>
      </el-form>
    </div>
  </div>
</template>
<script>
import { withdrawalDetail } from '@/api/financeListJava'
export default {
  filters: {
    // 审核
    checkType(e) {
      switch (e) {
        case 0:
          return '审核中'
          break
        case 1:
          return '审核通过'
          break
        case 2:
          return '驳回'
          break

        default:
          // return "暂无";
          break
      }
    }
  },
  data() {
    return {
      form: {
        remark: ''
      },
      isType: '',
      isStatus: '',
      detalisList: {},
      tableLoading: true
    }
  },
  created() {
    const recordId = this.$route.query.id
    this.isType = this.$route.query.types
    this.isStatus = this.$route.query.status
    this.getDetails({ id: Number(recordId) })
  },
  methods: {
    // 详情列表
    getDetails(e) {
      withdrawalDetail(e)
        .then(res => {
          if (!res.data.code) {
            // this.isType = res.data.data.accountType;
            this.detalisList = res.data.data
            this.form.remark = this.detalisList.remark
          } else {
            this.$message({
              showClose: true,
              message: res.data.msg,
              type: 'warning'
            })
          }
          this.tableLoading = false
        })
        .catch(err => {
          this.errorStatus(err)
          this.tableLoading = false
        })
    },
    // 弹窗组件
    eleMsg(txt, status) {
      this.$message({
        showClose: true,
        message: txt,
        type: status
      })
    },
    // 成功状态弹窗
    succStatus(txt, status) {
      this.eleMsg(txt, 'success')
    },
    // 失败状态弹窗
    errorStatus(txt) {
      this.eleMsg(txt, 'error')
    }
  }
}
</script>
<style scoped>
.app-container {
    padding: 0.1px !important;
}
.mar_top {
    margin-top: 50px;
}
</style>
